import React,{useState,useEffect} from 'react';
import {useHistory,useParams} from 'react-router-dom'
import * as api from './server';
import { Toast,NavBar } from 'antd-mobile';
import dayjs from './day';

const Topic = () => {
    const {id} = useParams();
    const history = useHistory();
    const [topic,setTopic] = useState({});
    useEffect(()=>{
        api.getCollect('HL1115')
            .then(res=>{
                console.log(res);
            })
        api.getTopic(id)
            .then(res=>{
                setTopic(res.data);
            })
    },[])
    const createTopic = ()=>{
        api.createTopic({
            accesstoken: 'e73b268b-f5d2-4ff1-8fd9-3581b84962e2',
            title: 'hello',
            tab: 'dev',
            content: '<h2>测试</h2>'
        })
            .then(res=>{
                if(res.success){
                    Toast.show({
                        icon: 'success',
                        content: '发布成功',
                    })
                }
            })
    }

    return (
        <div>
            <NavBar onBack={history.goBack}>标题</NavBar>
            <button onClick={createTopic}>发布主题</button>
            <h2>{topic.title}</h2>
            <h3>发布于{dayjs(topic.create_at).fromNow()}</h3>
            <div dangerouslySetInnerHTML={{__html:topic.content}}></div>
        </div>
    )
}

export default Topic